<template>
	<div class="main">
		<div class="custom-style">
<!--			<el-segmented class="top-item_title" v-model="queryParams.series" :options="seriesOptions.map(item => item.subject)" />-->
			<el-button class="top-item_title" style="margin: 0 12px 0 0" @click="addItem">新增教材</el-button>
			<el-upload
				ref="uploadRef"
				class="top-item_title"
				:show-file-list="false"
				action="#"
				:http-request="importFile"
				:limit="1"
			>
				<el-button type="primary">导入教材</el-button>
			</el-upload>
			<div style="clear: both"></div>
		</div>

		<booklist @showChapters="showChapters"></booklist>
	</div>
</template>

<script lang="ts" setup>
import { onMounted, reactive, ref } from 'vue';
import booklist from '../components/book-list.vue';
import { useCool } from '/@/cool/hooks';
import { delTextbookById } from '/@/api/home/index';

import { importExcel } from '/@/api/file/index';
import { ElMessage } from 'element-plus';
const { router } = useCool();
const uploadRef = ref(null);

const showChapters = async (item, type) => {
	if (type == 'edit') {
		await router.push({
			path: '/textbook/detail',
			query: Object.assign({}, item, { type: 'edit' })
		})
	} else if (type == 'delete') {
		await delTextbookById(item.id);
		//await queryBookList()
	}
}
const addItem = () => {
	router.push({
		path: '/textbook/detail',
		query: { type: 'add' }
	})
}

const importFile = async (file) => {
	let res = await importExcel(file.file);
	if (res.code == 200) {
		ElMessage.success('导入教材成功！');
	}
}
const handleSuccess = (response, uploadFile, uploadFiles) => {
	// 在此处写你需要的个性化步骤
	console.log('上传成功：', {response, uploadFile, uploadFiles})
}

const handleError = (error, uploadFile, uploadFiles) => {
	// 在此处写你需要的个性化步骤
	console.error('上传失败：', {error, uploadFile, uploadFiles})
}


</script>
